import 'package:flutter/material.dart';

class Tabbar extends StatelessWidget {
  final int currentIndex;
  final Function(int) onTap;

  const Tabbar({super.key, required this.currentIndex, required this.onTap});

  @override
  Widget build(BuildContext context) {
    final bottomPadding = MediaQuery.of(context).padding.bottom;
    return Container(
      height: 60 + bottomPadding, // 增加底部安全区域高度
      decoration: BoxDecoration(
        color: Colors.white,
        boxShadow: [
          BoxShadow(
            color: Colors.grey.withValues(alpha: 0.3),
            spreadRadius: 1,
            blurRadius: 5,
          ),
        ],
      ),
      child: Padding(
        padding: EdgeInsets.only(bottom: bottomPadding), // 为内容增加底部内边距
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: [
            Expanded(
              child: _buildNavItem(context, 'home', '首页', 0),
            ), // 添加Expanded
            Expanded(
              child: _buildNavItem(context, 'kuaixun', '快讯', 1),
            ), // 添加Expanded
            Expanded(
              child: _buildNavItem(context, 'zhuanlan', '专栏', 2),
            ), // 添加Expanded
            Expanded(
              child: _buildNavItem(context, 'huodong', '活动', 3),
            ), // 添加Expanded
            Expanded(
              child: _buildNavItem(context, 'faxian', '我的', 4),
            ), // 添加Expanded
          ],
        ),
      ),
    );
  }

  Widget _buildNavItem(
    BuildContext context,
    String iconPath, // 修改参数类型为 String
    String label,
    int index,
  ) {
    final bool isSelected = currentIndex == index;

    return GestureDetector(
      onTap: () => onTap(index),
      child: Container(
        color: Colors.white, // 将 backgroundColor 移到 Container 中
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Padding(
              padding: EdgeInsets.only(bottom: 4, top: 6),
              child: Image.asset(
                'assets/images/tabbar/$iconPath${isSelected ? "_sel" : ""}.png',
                width: 26,
                height: 26,
              ),
            ),
            if (isSelected)
              ShaderMask(
                shaderCallback: (bounds) => const LinearGradient(
                  colors: [Colors.blue, Colors.purple],
                ).createShader(bounds),
                child: Text(
                  label,
                  style: const TextStyle(
                    color: Colors.white,
                    fontSize: 10,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              )
            else
              Text(
                label,
                style: const TextStyle(color: Color(0xffCCCCCC), fontSize: 10),
              ),
          ],
        ),
      ),
    );
  }
}
